<template>
  <div>
    <div>{{ isStart ? approval.userAvatar : node["approverUserAvatar"] }}</div>
    <div>{{ nodeName }}</div>
    <div>{{ userName }}</div>
    <div>{{ isStart ? "发起申请" : getApprovalStatus(node["approStatus"]) }}</div>
  </div>
</template>
<script>
import { getApprovalStatus, getApprovalType } from "../funcs";
export default {
  name: "",
  components: {},
  mixins: [],
  props: {
    node: {
      type: Object,
      default: () => {}
    },
    approval: {
      type: Object,
      default: () => {}
    }
  },
  data() {
    return {};
  },
  computed: {
    isStart() {
      return this.node.nodeType === "start";
    },
    isTask() {
      return this.node.nodeType === "task";
    },
    nodeName() {
      return this.node.nodeNAme;
    },
    userName() {
      if (this.isStart) {
        return this.approval.userName;
      } else if (this.isTask) {
        if (this.node.userFlowApproverList) {
          const first = this.node.userFlowApproverList[0];
          const size = this.node.userFlowApproverList.length;
          return `${first.approverUserName}${size > 1 ? "等" + size + "人" : ""}`;
        }
      } else {
        if (this.node.userFlowApproverList) {
          const first = this.node.userFlowApproverList[0];
          const size = this.node.userFlowApproverList.length;
          return `${first.approverUserName}${size > 1 ? "等" + size + "人" : ""}`;
        }
      }
      return null;
    }
  },
  watch: {},
  created() {},
  mounted() {},
  methods: {
    getApprovalStatus,
    getApprovalType
  }
};
</script>
<style lang="scss"></style>
